<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="/css/header.css">
    <link rel="stylesheet" href="/css/footer.css">
    <link rel="stylesheet" href="/css/main.css">
    <link rel="stylesheet" href="libs/swiper.css">
    <link rel="stylesheet" href="./font/iconfont.css">
</head>

<body>
    <header>
    </header>
    <section>
        <div class="nav">
            <div class="logo"></div>
            <div class="nav_nav">
                <ul>
                    <li>
                        <a href="">Xiaomi手机</a>
                        <ul>

                        </ul>
                    </li>
                    <li><a href="">Redmi红米</a>
                        <ul>
                        </ul>
                    </li>
                    <li><a href="">电视</a>
                         <ul>

                        </ul></li> 
                    <li><a href="">笔记本</a>
                        <ul>
                          
                        </ul></li> 
                    <li><a href="">平板</a>
                        <ul>
                       
                        </ul></li> 
                    <li><a href="">家电</a>
                       <ul>
                  
                        </ul></li> 
                    <li><a href="">路由器</a>
                     <ul>
            
                        </ul></li> 
                    <li><a href="">服务</a>
                    </li>
                    <li><a href="">社区</a>
                    </li>
                </ul>
            </div>
            <div class="sever">
                <input type="text" class="ssk" value="小米手机">
                <a href="#" class="iconfont icon-sousuokuang"></a>
            </div>
        </div>
    </section>


    <div class="nav_xl">
        <div class="xl">
            <ul class="xlXr">
                <li>
                    <a href="">
                        <ul>
                            <li>
                                <img src="img/2.webp" alt="">
                                <span>Xiaomi手机</span>
                                <br>
                                <p>2229元</p>
                            </li>
                            <li></li>
                            <li></li>
                        </ul>
                    </a>
                </li>
                <li><a href=""></a></li>
                <li><a href=""></a></li>
                <li><a href=""></a></li>
                <li><a href=""></a></li>
                <li><a href=""></a></li>
            </ul>
        </div>
    </div>
    <div class="lb">
        <ul>
            <li>手机</li>
            <li>电视</li>
            <li>笔记本 平板</li>
            <li>家电</li>
            <li>出行 穿戴</li>
            <li>智能 路由器</li>
            <li>电源 配件</li>
            <li>健康 儿童</li>
            <li>耳机 音响</li>
            <li>生活 箱包</li>
        </ul>
        <!-- 轮播图-->
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/8e169482b8cbf7a68daaef1464881446.jpg?w=2452&h=920" alt=""></div>
                <div class="swiper-slide"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/8e169482b8cbf7a68daaef1464881446.jpg?w=2452&h=920" alt=""></div>
                <div class="swiper-slide"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/8e169482b8cbf7a68daaef1464881446.jpg?w=2452&h=920" alt=""></div>
            </div>
            <!-- Add Pagination -->
            <div class="swiper-pagination"></div>
            <!-- Add Arrows -->
            <div class="swiper-button-next"></div>
            <div class="swiper-button-prev"></div>
        </div>
    </div>
    <div class="sub">
        <div class="sub_left">
            <ul>
                <li class="iconfont icon-gouwuchekong"><a href="#">保障服务</a></li>
                <li class="iconfont icon-gouwuchekong"><a href="#">企业团购</a></li>
                <li class="iconfont icon-gouwuchekong"><a href="#">F码通道</a></li>
                <li class="iconfont icon-sousuokuang"><a href="#">米饭卡</a></li>
                <li class="iconfont icon-sousuokuang"><a href="#">以旧换新</a></li>
                <li class="iconfont icon-sousuokuang"><a href="#">话费充值</a></li>
            </ul>
        </div>
        <div class="sub_right">
            <a href="">
                <img src="img/6.jpg" alt="">
            </a>
        </div>
        <div class="sub_right">
            <a href="">
                <img src="img/6.jpg" alt="">
            </a>
        </div>
        <div class="sub_right">
            <a href="">
                <img src="img/6.jpg" alt="">
            </a>
        </div>
    </div>
    <main>
        <div class="main">
            <img src="img/1.webp" alt="">
        </div>
        <div class="box-id">
            <h2>手机</h2>
            <a href="">查看更多&gt;</a>
        </div>
        <div class="xr">
            <div class="xr_left">

            </div>
            <ul>
                
            </ul>
        </div>

        <!-- 视频 -->
        <div class="box-id">
            <h2>视频</h2>
            <a href="">查看更多&gt;</a>
        </div>
        <div class="sp">
            <ul>
                <li><a href=""><img src="img/6.jpg" alt=""></a></li>
                <li><a href=""><img src="img/6.jpg" alt=""></a></li>
                <li><a href=""><img src="img/6.jpg" alt=""></a></li>
                <li><a href=""><img src="img/6.jpg" alt=""></a></li>
            </ul>
        </div>
        <!-- button -->
        <div class="site-footer">
            <div class="footer-service">
                <ul>
                    <li><em class="iconfont icon-gouwuchekong"></em><a href="">维修预约服务</a></li>
                    <li><em class="iconfont icon-gouwuchekong"></em><a href="">维修预约服务</a></li>
                    <li><em class="iconfont icon-gouwuchekong"></em><a href=""></em>维修预约服务</a></li>
                    <li><em class="iconfont icon-gouwuchekong"></em><a href=""></em>维修预约服务</a></li>
                    <li style="border: none;"><em class="iconfont icon-gouwuchekong"></em><a href="">维修预约服务</a></li>
                </ul>
                <div class="bz">
                    <div class="bz_left">
                        <ul class="ab">
                            <li><b>帮助中心</b></li>
                            <li><b>帮助中心</b></li>
                            <li><b>帮助中心</b></li>
                            <li><b>帮助中心</b></li>
                            <li><b>帮助中心</b></li>
                            <li><b>帮助中心</b></li>
                        </ul>
                        <div class="ac">
                            <ul>
                                <li><a href="">账户管理</a> </li>
                                <li><a href="">订单操作</a></li>
                                <li><a href="">购物指南</a></li>
                            </ul>
                            <ul>
                                <li><a href="">账户管理</a> </li>
                                <li><a href="">订单操作</a></li>
                                <li><a href="">购物指南</a></li>
                            </ul>
                            <ul>
                                <li><a href="">账户管理</a> </li>
                                <li><a href="">订单操作</a></li>
                                <li><a href="">购物指南</a></li>
                            </ul>
                            <ul>
                                <li><a href="">账户管理</a> </li>
                                <li><a href="">订单操作</a></li>
                                <li><a href="">购物指南</a></li>
                            </ul>
                            <ul>
                                <li><a href="">账户管理</a> </li>
                                <li><a href="">订单操作</a></li>
                                <li><a href="">购物指南</a></li>
                            </ul>
                            <ul>
                                <li><a href="">账户管理</a> </li>
                                <li><a href="">订单操作</a></li>
                                <li><a href="">购物指南</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="bz_right">
                        <div class="conn">
                            <p>400-820-5678</p>
                            <i>8:00-18:00(仅收市话费)</i>
                            <div class="rg">
                                <em class="iconfont icon-gouwuchekong"></em>
                                <a href="">人工客服</a>
                            </div>
                            <p class="gz">关注小米：<em class="iconfont icon-gouwuchekong"></em>
                                <em class="iconfont icon-gouwuchekong"></em>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>
    <footer>
    </footer>
    <script src="libs/require.js" data-main="js/main"></script>
</body>

</html>